<!DOCTYPE html>
<html lang="en">

<head>
<meta charset="UTF-8">
 <meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
 <title>Document</title>
<script src="../vue.js"></script>
</head>

<body>
<div id="app">

 <h1>{{isHot?"热啊":"动啊"}}</h1>
 <button @click="isHot=!isHot">change</button>
 </div>
 <script>
    Vue.config.productionTip=false;

    const vm=new Vue({
        el:"#app",
        data(){
            return {
                isHot:true,
            }
        },
        watch:{
            //如果没有深度监听和立即监听,可以直接使用watch的简写
            isHot(){
                console.log("改变天气了");
            }
        }
    })
 </script>
</body>

</html>